import {
    RadiusUpleftOutlined,
} from '@ant-design/icons';
import { Button, notification, Space } from 'antd';
import React from 'react';
const Context = React.createContext({
    name: 'Default',
});

const Notification = () => {
    const [api, contextHolder] = notification.useNotification();

    const openNotification = (placement) => {
        api.info({
            message: `Notification ${placement}`,
            description: <Context.Consumer>{({ name }) => ` ${name}`}</Context.Consumer>,
            placement,
        });
    };

    return (
        <Context.Provider
            value={{
                name: 'Ant Design',
            }}
        >
            {contextHolder}
            <Space>
                <RadiusUpleftOutlined />
                <Button type="primary" onClick={() => openNotification('topRight')}>

                    topLeft
                </Button>
            </Space>
{/*            <Space>
                <Button type="primary" onClick={() => openNotification('bottomLeft')}>
                    <RadiusBottomleftOutlined />
                    bottomLeft
                </Button>
                <Button type="primary" onClick={() => openNotification('bottomRight')}>
                    <RadiusBottomrightOutlined />
                    bottomRight
                </Button>
            </Space>*/}
        </Context.Provider>
    );
};

export default Notification;